یکی از المانهای ساده اما بسیار کاربردی در طراحی صفحات وب، ابزارک Divider یا جداکننده در المنتور است. شاید در نگاه اول تصور کنید یک خط ساده چندان تأثیری در طراحی ندارد، اما واقعیت این است که همین المان کوچک میتواند تفاوت بزرگی در ظاهر سایت ایجاد کند. جداکنندهها به طراحی نظم میبخشند، بخشهای مختلف محتوا را از هم تفکیک میکنند و باعث میشوند کاربر هنگام مطالعه دچار خستگی بصری نشود.
هیچکدام از ما از شلوغی و بینظمی در صفحات وب خوشمان نمیآید. کاربری که وارد سایتی با متنهای فشرده و بدون فاصله شود، بهسرعت خسته شده و صفحه را ترک میکند. به همین دلیل، استفاده درست از جداکنندهها نقش مهمی در زیبایی و تجربه کاربری سایت دارد. در ادامه با روش استفاده از ابزارک Divider در المنتور آشنا میشویم.
نحوه ساخت جداکننده در المنتور
برای ایجاد یک جداکننده در المنتور کافی است مراحل زیر را دنبال کنید:
-
ابتدا یک سکشن جدید در صفحه ایجاد کنید.
-
ابزارک Divider را از بخش المانها انتخاب کرده و در سکشن قرار دهید.
-
رنگ و اندازه جداکننده را متناسب با رنگبندی کلی صفحه تغییر دهید تا هماهنگی بصری ایجاد شود.
بعد از قرار دادن جداکننده، دو بخش اصلی برای تنظیمات آن وجود دارد:
تنظیمات محتوا
در این بخش میتوانید نوع جداکننده را انتخاب کنید (خط ساده، نقطهچین، خط دوتایی و …). همچنین امکان تعیین عرض خط، موقعیت (چپ، راست یا وسطچین) و اضافه کردن المانهای دیگر مثل آیکن یا متن در مرکز جداکننده وجود دارد. به این ترتیب میتوانید آن را کاملاً با سبک طراحی سایت خود هماهنگ کنید.
تنظیمات استایل
بخش استایل به شما اجازه میدهد ظاهر جداکننده را به شکل دلخواه تغییر دهید. در این بخش میتوانید رنگ خط را مشخص کنید، ضخامت و اندازه آن را تغییر دهید و فاصله آن را از بخشهای بالا و پایین تنظیم کنید. اگر در جداکننده از آیکن یا متن استفاده کرده باشید، میتوانید رنگ، سایز، تایپوگرافی، موقعیت و فاصله آنها را نیز تغییر دهید. این امکانات باعث میشود یک خط ساده به المانی زیبا و هماهنگ با طراحی کلی سایت تبدیل شود.
جمعبندی
ابزارک Divider در المنتور هرچند ظاهری ساده دارد اما استفاده درست از آن تأثیر زیادی در زیبایی و نظم سایت خواهد داشت. با کمک این ابزار میتوانید محتوا را بخشبندی کنید، به متنها ساختار بدهید و تجربه کاربری بهتری برای مخاطبانتان ایجاد کنید. پیشنهاد میشود هنگام طراحی صفحات طولانی یا زمانی که نیاز به تفکیک بصری میان بخشها دارید، از این قابلیت کاربردی المنتور استفاده کنید.
منبع : https://ofoghweb.com/divider-widget-elemntor/
:: بازدید از این مطلب : 3
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0